<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <title>es2015</title>

</head>

<body>
    <div id="div">
        <button type="button">按钮</button>
    </div>
    <script>
        //箭头函数 ES6允许使用“箭头”（=>）定义函数。
        var f = v => v;
        /*相当于
        var f = function (v) {
            return v
        }*/

        //如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。
        var f1 = () => {return 5}
        /*相当于
        var f1 = function(){
            return 5
        }*/
        //如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回
        var sum = (sum1,sum2) => {return sum1+sum2}
        //由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号。
        var getId = () =>({id:'di',name:'yuanse'})
        // function foo (){
        //     setTimeout(() => {
        //         console.log('id',this.id)
        //     },100)
        // }

        /*
         function Timer(){
            this.s1 = 0;
            this.s2 = 0;
            setInterval(() => {this.s1++},1000);
            setInterval(function(){
                this.s2++
            },1000)
        }
        var timer = new Timer();
        setTimeout(() => {console.log('s1',timer.s1)},3100);
        setTimeout(() => {console.log('s2',timer.s2)},3100)
        */
       






        var btn = document.getElementById('div').getElementsByTagName('button')[0];
        btn.onclick = function(){
           console.log(getId())
        }
    </script>
</body>

</html>